//package com.example.compose
//
//import android.graphics.BitmapShader
//import android.graphics.Shader
//import androidx.compose.animation.AnimatedVisibility
//import androidx.compose.animation.EnterTransition
//import androidx.compose.animation.ExitTransition
//import androidx.compose.animation.ExperimentalSharedTransitionApi
//import androidx.compose.animation.SharedTransitionLayout
//import androidx.compose.animation.core.animateDpAsState
//import androidx.compose.animation.core.spring
//import androidx.compose.animation.core.tween
//import androidx.compose.foundation.Image
//import androidx.compose.foundation.background
//import androidx.compose.foundation.clickable
//import androidx.compose.foundation.layout.Box
//import androidx.compose.foundation.layout.Column
//import androidx.compose.foundation.layout.Row
//import androidx.compose.foundation.layout.aspectRatio
//import androidx.compose.foundation.layout.fillMaxSize
//import androidx.compose.foundation.layout.fillMaxWidth
//import androidx.compose.foundation.layout.height
//import androidx.compose.foundation.layout.padding
//import androidx.compose.foundation.layout.requiredHeightIn
//import androidx.compose.foundation.layout.size
//import androidx.compose.foundation.shape.RoundedCornerShape
//import androidx.compose.material.icons.Icons
//import androidx.compose.material.icons.outlined.Create
//import androidx.compose.material.icons.outlined.Favorite
//import androidx.compose.material.icons.outlined.Share
//import androidx.compose.material3.Icon
//import androidx.compose.material3.Surface
//import androidx.compose.runtime.Composable
//import androidx.compose.runtime.getValue
//import androidx.compose.runtime.movableContentOf
//import androidx.compose.runtime.mutableStateOf
//import androidx.compose.runtime.remember
//import androidx.compose.runtime.setValue
//import androidx.compose.ui.Alignment
//import androidx.compose.ui.Modifier
//import androidx.compose.ui.draw.clip
//import androidx.compose.ui.graphics.Color
//import androidx.compose.ui.graphics.ImageBitmap
//import androidx.compose.ui.graphics.ShaderBrush
//import androidx.compose.ui.graphics.asAndroidBitmap
//import androidx.compose.ui.layout.ContentScale
//import androidx.compose.ui.res.imageResource
//import androidx.compose.ui.res.painterResource
//import androidx.compose.ui.tooling.preview.Preview
//import androidx.compose.ui.unit.dp
//
//@OptIn(ExperimentalSharedTransitionApi::class)
//@Composable
//fun NestedSharedBoundSample() {
//    val selectionColor = Color(0xff3367ba)
//    var expanded by remember { mutableStateOf(true) }
//    SharedTransitionLayout(
//        modifier = Modifier
//            .fillMaxSize()
//            .clickable { expanded = !expanded }
//            .background(Color(0x88000000))
//    ) {
//        AnimatedVisibility(
//            visible = expanded,
//            enter = EnterTransition.None,
//            exit = ExitTransition.None
//        ) {
//            Box(modifier = Modifier.fillMaxSize()) {
//                Surface(
//                    modifier = Modifier
//                        .align(Alignment.BottomCenter)
//                        .padding(20.dp)
//                        .sharedBounds(
//                            rememberSharedContentState(key = "container"),
//                            this@AnimatedVisibility
//                        )
//                        .requiredHeightIn(max = 60.dp),
//                    shape = RoundedCornerShape(50)
//                ) {
//                    Row(
//                        modifier = Modifier
//                            .padding(10.dp)
//                            .skipToLookaheadSize()
//                    ) {
//                        Icon(
//                            imageVector = Icons.Outlined.Share,
//                            contentDescription = "Shared",
//                            modifier = Modifier.padding(
//                                top = 10.dp,
//                                bottom = 10.dp,
//                                start = 10.dp,
//                                end = 20.dp
//                            )
//                        )
//                        Icon(
//                            imageVector = Icons.Outlined.Favorite,
//                            contentDescription = "Favorite",
//                            modifier = Modifier.padding(
//                                top = 10.dp,
//                                bottom = 10.dp,
//                                start = 10.dp,
//                                end = 20.dp
//                            )
//                        )
//                        Icon(
//                            imageVector = Icons.Outlined.Create,
//                            contentDescription = "Create",
//                            tint = Color.White,
//                            modifier = Modifier
//                                .sharedBounds(
//                                    rememberSharedContentState(key = "icon_background"),
//                                    this@AnimatedVisibility
//                                )
//                                .padding(
//                                    top = 10.dp,
//                                    bottom = 10.dp,
//                                    start = 10.dp,
//                                    end = 20.dp
//                                )
//                                .sharedElement(
//                                    rememberSharedContentState(key = "icon"),
//                                    this@AnimatedVisibility
//                                )
//                        )
//                    }
//                }
//            }
//        }
//        AnimatedVisibility(
//            visible = !expanded,
//            enter = EnterTransition.None,
//            exit = ExitTransition.None
//        ) {
//            Box(modifier = Modifier.fillMaxSize()) {
//                Surface(
//                    modifier = Modifier
//                        .align(Alignment.BottomEnd)
//                        .padding(30.dp)
//                        .sharedBounds(
//                            rememberSharedContentState(key = "container"),
//                            this@AnimatedVisibility,
//                            enter = EnterTransition.None
//                        )
//                        .sharedBounds(
//                            rememberSharedContentState(key = "icon_background"),
//                            this@AnimatedVisibility,
//                            enter = EnterTransition.None,
//                            exit = ExitTransition.None
//                        ),
//                    shape = RoundedCornerShape(30.dp),
//                    color = selectionColor
//                ) {
//                    Icon(
//                        imageVector = Icons.Outlined.Create,
//                        contentDescription = "Create",
//                        tint = Color.White,
//                        modifier = Modifier
//                            .padding(30.dp)
//                            .size(40.dp)
//                            .sharedElement(
//                                rememberSharedContentState(key = "icon"),
//                                this@AnimatedVisibility
//                            )
//                    )
//                }
//            }
//        }
//    }
//}
//
//@OptIn(ExperimentalSharedTransitionApi::class)
//@Preview
//@Composable
//fun SharedElementWithMovableContentSample() {
//    var showThumbnail by remember { mutableStateOf(true) }
//    val movableContent = remember {
//        movableContentOf {
//            val cornerRadius = animateDpAsState(
//                targetValue = if (!showThumbnail) 20.dp else 5.dp,
//                label = "",
//            )
//            Image(
//                painter = painterResource(id = R.drawable.bella),
//                contentDescription = "cute dog",
//                contentScale = ContentScale.FillHeight,
//                modifier = Modifier.clip(shape = RoundedCornerShape(cornerRadius.value))
//            )
//        }
//    }
//    SharedTransitionLayout(
//        modifier = Modifier
//            .clickable { showThumbnail = !showThumbnail }
//            .fillMaxSize()
//            .padding(10.dp)
//    ) {
//        Column {
//            Box(
//                modifier = Modifier
//                    .sharedElementWithCallerManagedVisibility(
//                        rememberSharedContentState(key = "YT"),
//                        visible = showThumbnail
//                    )
//                    .size(100.dp)
//            ) {
//                if (showThumbnail) {
//                    movableContent()
//                }
//            }
//            Box(
//                modifier = Modifier
//                    .fillMaxWidth()
//                    .height(100.dp)
//                    .background(color = Color(0xffffcc5c), shape = RoundedCornerShape(5.dp))
//            )
//            Box(
//                modifier = Modifier
//                    .fillMaxWidth()
//                    .height(100.dp)
//                    .background(color = Color(0xff2a9d84), shape = RoundedCornerShape(5.dp))
//            )
//        }
//        Box(
//            modifier = Modifier
//                .fillMaxSize()
//                .aspectRatio(1f)
//                .sharedElementWithCallerManagedVisibility(
//                    sharedContentState = rememberSharedContentState(key = "yt"),
//                    visible = !showThumbnail
//                )
//        ) {
//            if (!showThumbnail) {
//                movableContent()
//            }
//        }
//    }
//}